<ion-header>
    <ion-toolbar>
        <ion-title>用户登录</ion-title>
    </ion-toolbar>
</ion-header>
<!-- ion-padding固定样式，用来添加内边距的 -->
<ion-content class="ion-padding">
    <ion-card>
        <ion-item>
            <ion-label>用户名:</ion-label>
            <ion-input type="text" [(ngModel)]="name"></ion-input>
        </ion-item>
        <ion-item>
            <ion-label>密&nbsp;&nbsp;&nbsp;码:</ion-label>
            <ion-input type="password" [(ngModel)]="pwd"></ion-input>
        </ion-item>
        <ion-button expand="block" (click)="login()">
            登录
        </ion-button>
        <h6>其他方式登录</h6>

        <ion-button color="dark">
            <ion-icon name="logo-tiktok"></ion-icon>
        </ion-button>
        <ion-button color="secondary">
            <ion-icon name="logo-alipay"></ion-icon>
        </ion-button>
        <ion-button color="tertiary">
            <ion-icon name="logo-angular"></ion-icon>
        </ion-button>
        <ion-button color="danger">
            <ion-icon name="logo-css3"></ion-icon>
        </ion-button>
        <ion-button color="success">
            <ion-icon name="logo-github"></ion-icon>
        </ion-button>
    </ion-card>
</ion-content>